<template>
    <!--商户详情-->
    <el-dialog
            title="商户详情"
            :visible.sync="dialogVisible"
            width="70%"
            :before-close="handleClose">
        <el-form  ref="ruleForm" label-width="130px" class="ruleForm">
            <el-row>
                <el-col :span="12">
                    <el-form-item label="店铺名称：">
                        {{ruleForm.name}}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="店铺开业时间：">
                        {{ruleForm.registerDate}}
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="联系人：" prop="contact">
                        {{ruleForm.contact}}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="联系电话：" prop="contactPhone">
                        {{ruleForm.contactPhone}}
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="入驻城市：" prop="inCity">
                        {{ruleForm.inCity}}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="详细地址：" prop="address">
                        {{ruleForm.address}}
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="24">
                    <el-form-item label="营业执照：" prop="licenseFile">
                        <el-image
                                style="width: 100px; height: 100px"
                                :src="ruleForm.businessLicensePath"
                                :preview-src-list="[ruleForm.businessLicensePath]">
                        </el-image>

                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="店铺图片：">
                        <el-carousel :interval="5000" arrow="always">
                            <el-carousel-item v-for="(item,i) in ruleForm.imgList" :key="i">
                                <el-image
                                        style="width: 100%; height: 100%"
                                        :src="item.path"
                                        :preview-src-list="ruleForm.imgList.map(x=>x.path)">
                                </el-image>

                            </el-carousel-item>
                        </el-carousel>

                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </el-dialog>
</template>

<script>
    export default {
        name: "info",
        data(){
            return{
                //控制弹框开关
                dialogVisible:false,
                //商户信息
                ruleForm:{},
                //城市集合
                cityList: [],
            }
        },
        methods:{

            //打开弹框
            openDia(row){
                let info=this.$util.copyBean(row);

                //获取系统上线城市
                this.$HttpService.get("/common/getItem/online_area").then(res => {
                    this.cityList = res;
                })

                //查询商户图片
                this.$HttpService.get("/bus-file/notLogin/findList?tableId="+info.id+"&fileBusiness="+this.$dict.FileBusiness.MERCHANTS).then(res=>{
                    info["imgList"]=res.map(x=>{
                        x.path=this.$util.getFileUrl(x.path);
                        return x;
                    });
                    this.ruleForm=info;
                    //设置图片地址
                    this.ruleForm.businessLicensePath=this.$util.getFileUrl(this.ruleForm.businessLicensePath);
                    this.dialogVisible=true;
                })
            },



            //关闭弹框
            handleClose(done) {
                done();
            },
        }
    }
</script>

<style scoped lang="less">

</style>
